<!DOCTYPE html>
<html>
<head>
    <title></title>
    <script src="jquery.js"></script>
</head>
<style>

</style>

<script>
    $(function(){
        var obj = document.getElementById("test");
        console.log(obj.offsetHeight);
        console.log(obj.clientHeight);
        console.log(obj.scrollTop);
    });

    window.οnscrοll=function(){
        //alert(1);
        var obj = document.getElementById("test");
        //滚动条距离顶部的高度
        console.log("getScrollTop() : " + getScrollTop());
        //可视化窗口的高度
        console.log("getClientHeight() : " + getClientHeight());
        //内容的高度
        console.log("getScrollHeight() : " + getScrollHeight());
        //test();
    };

    /********************
     * 取窗口滚动条高度
     ******************/
    function getScrollTop() {
        var scrollTop = 0;
        if (document.documentElement && document.documentElement.scrollTop) {
            scrollTop = document.documentElement.scrollTop
        } else {
            if (document.body) {
                scrollTop = document.body.scrollTop
            }
        }
        return scrollTop
    }

    /********************
     * 取窗口可视范围的高度
     *******************/
    function getClientHeight() {
        var clientHeight = 0;
        if (document.body.clientHeight && document.documentElement.clientHeight) {
            var clientHeight = (document.body.clientHeight < document.documentElement.clientHeight) ? document.body.clientHeight: document.documentElement.clientHeight
        } else {
            var clientHeight = (document.body.clientHeight > document.documentElement.clientHeight) ? document.body.clientHeight: document.documentElement.clientHeight
        }
        return clientHeight
    }

    /********************
     * 取文档内容实际高度
     *******************/
    function getScrollHeight() {
        return Math.max(document.body.scrollHeight, document.documentElement.scrollHeight)
    }

    function test() {
        if (getScrollTop() + getClientHeight() == getScrollHeight()) {
            alert("到达底部")
        } else {
            alert("没有到达底部")
        }
    };
</script>
<body>

<div id="test" style="width:100%;height:3000px;border:1px solid red;">
    dsafdsaf
</div>

</body>
</html>